home *** CD-ROM | disk | FTP | other *** search
/ PC go! 2018 January / PCgo 01-2018 CD-ROM Germany.iso / nw.pak / Unnamed File 005268.txt < prev    next >
Encoding:
Text File  |  2015-07-29  |  2.8 KB  |  116 lines

  1. <!DOCTYPE html>
  2. <head>
  3. <style>
  4.   body {
  5.     margin: 0px;
  6.     width: 0px;
  7.   }
  8.   .row {
  9.     display: table-row;
  10.     vertical-align: inherit;
  11.   }
  12.   #header, #footer {
  13.     display: table;
  14.     table-layout:fixed;
  15.     width: inherit;
  16.   }
  17.   #header {
  18.     vertical-align: top;
  19.   }
  20.   #footer {
  21.     vertical-align: bottom;
  22.   }
  23.   .text {
  24.     display: table-cell;
  25.     font-family: sans-serif;
  26.     font-size: 8px;
  27.     vertical-align: inherit;
  28.     white-space: nowrap;
  29.   }
  30.   #page_number {
  31.     text-align: right;
  32.   }
  33.   #title {
  34.     text-align: center;
  35.   }
  36.   #date, #url {
  37.     padding-left: 0.7cm;
  38.     padding-right: 0.1cm;
  39.   }
  40.   #title, #page_number {
  41.     padding-left: 0.1cm;
  42.     padding-right: 0.7cm;
  43.   }
  44.   #title, #url {
  45.     overflow: hidden;
  46.     text-overflow: ellipsis;
  47.   }
  48.   #title, #date {
  49.     padding-bottom: 0cm;
  50.     padding-top: 0.4cm;
  51.   }
  52.   #page_number, #url {
  53.     padding-bottom: 0.4cm;
  54.     padding-top: 0cm;
  55.   }
  56. </style>
  57. <script>
  58.  
  59. function pixels(value) {
  60.   return value + 'px';
  61. }
  62.   
  63. function setup(options) {
  64.   var body = document.querySelector('body');
  65.   var header = document.querySelector('#header');
  66.   var content = document.querySelector('#content');
  67.   var footer = document.querySelector('#footer');
  68.  
  69.   body.style.width = pixels(options['width']);
  70.   body.style.height = pixels(options['height']);
  71.   header.style.height = pixels(options['topMargin']);
  72.   content.style.height = pixels(options['height'] - options['topMargin'] -
  73.                                 options['bottomMargin']);
  74.   footer.style.height = pixels(options['bottomMargin']);
  75.  
  76.   document.querySelector('#date span').innerText = options['date'];
  77.   document.querySelector('#title span').innerText = options['title'];
  78.   document.querySelector('#url span').innerText = options['url'];
  79.   document.querySelector('#page_number span').innerText = options['pageNumber'];
  80.  
  81.   // Reduce date and page number space to give more space to title and url.
  82.   document.querySelector('#date').style.width =
  83.       pixels(document.querySelector('#date span').offsetWidth);
  84.   document.querySelector('#page_number').style.width =
  85.       pixels(document.querySelector('#page_number span').offsetWidth);
  86.  
  87.   // Hide text if it doesn't fit into expected margins.
  88.   if (header.offsetHeight > options['topMargin'] + 1) {
  89.     header.style.display = 'none';
  90.     content.style.height = pixels(options['height'] - options['bottomMargin']);
  91.   }
  92.   if (footer.offsetHeight > options['bottomMargin'] + 1) {
  93.     footer.style.display = 'none';
  94.   }
  95. }
  96.  
  97. </script>
  98. </head>
  99. <body>
  100.   <div id="header">
  101.     <div class="row">
  102.       <div id="date" class="text"><span/></div>
  103.       <div id="title" class="text"><span/></div>
  104.     </div>
  105.   </div>
  106.   <div id="content">
  107.   </div>
  108.   <div id="footer">
  109.     <div class="row">
  110.       <div id="url" class="text"><span/></div>
  111.       <div id="page_number" class="text"><span/></div>
  112.     </div>
  113.   </div>
  114. </body>
  115. </html>
  116.